package myJs.cps.myTable

import japgolly.scalajs.react._
import japgolly.scalajs.react.vdom.all._
import myJs.myPkg.i18n.ReactI18next

import scala.scalajs.js
import cats.effect._
import japgolly.scalajs.react.util.EffectCatsEffect._
/** Created by yz on 15/9/2023
  */
object DescLiCp {

  case class Props(onClickF: IO[Unit], isActive: Boolean, isNumeric: Boolean = false)

  val Component = ScalaFnComponent[Props] { props =>

    val js.Tuple3(t, i18n, _) = ReactI18next.useTranslation()

    val liActive = if (props.isActive) {
      "active"
    } else ""
    val faCls = if (props.isNumeric) "fa-sort-numeric-desc" else "fa-sort-alpha-desc"
    li(
      className := s"myLi hasHover mySortLi ${liActive}",
      onClick --> props.onClickF,
      span(className := "sortFa", i(className := s"fa ${faCls}")),
      span(t("descendingSort").toString)
    )

  }

  def apply(
      onClickF: IO[Unit],
      isActive: Boolean,
      isNumeric: Boolean = false
  ) = {
    Component(
      Props(
        onClickF,
        isActive,
        isNumeric
      )
    )
  }

}
